<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>学习资料</title>
  <style>
    .container{
      margin: 0 auto;
      width: 1000px;
      display: flex;
      flex-flow: row wrap;
      justify-content: space-between;
      
    }
    .title{
      text-align: center;
      margin: 20px 0;
      font-size: 30px;
    }
    .course{
      width: 400px;
      padding: 20px;
    }
    .c-name{
      color: #409eff;
      text-decoration: none;
      font-size: 24px;
      font-weight: bold;
      padding: 0 0 10px 0;
      display: block;
    }
    .c-desc{
      font-size: 14px;
      color: #666;;
    }
  </style>
</head>
<body>
  <div class="title">码农学习资料</div>
  <div class="container">
    
    <div class="course">
      <a href="https://cn.vuejs.org/" target="_blank" class="c-name">Vue</a>
      <div class="c-desc">渐进式，易学易用，性能出色，适用场景丰富的 Web 前端框架。</div>
    </div>
    <div class="course">
      <a href="https://element-plus.org/zh-CN/#/zh-CN" target="_blank" class="c-name">Element Plus</a>
      <div class="c-desc">基于 Vue 3，面向设计师和开发者的组件库</div>
    </div>
    <div class="course">
      <a href="https://echarts.apache.org/zh/index.html" target="_blank" class="c-name">Apache ECharts</a>
      <div class="c-desc">一个基于 JavaScript 的开源可视化图表库</div>
    </div>
    <div class="course">
      <a href="https://spring.io/projects/spring-boot" target="_blank" class="c-name">Spring Boot</a>
      <div class="c-desc">基于Spring,目的是简化Spring应用的创建和配置。</div>
    </div>
    <div class="course">
      <a href="https://nginx.org/en/" target="_blank" class="c-name">nginx</a>
      <div class="c-desc">是一个高性能的HTTP和反向代理web服务器，同时也提供了IMAP/POP3/SMTP服务</div>
    </div>
    <div class="course">
      <a href="https://mybatis.p2hp.com/" target="_blank" class="c-name">MyBatis</a>
      <div class="c-desc">是一款优秀的持久层框架，它支持自定义 SQL、存储过程以及高级映射。</div>
    </div>
    <div class="course">
      <a href="https://www.mysql.com/" target="_blank" class="c-name">MySql</a>
      <div class="c-desc">MySQL是一个关系型数据库管理系统，由瑞典 MySQL AB 公司开发，属于 Oracle 旗下产品。</div>
    </div>
  </div>
</body>
</html>

